<template>
    <div>
        <!-- 商品区域 -->
      <div class="mui-card carlist">
				<div class="mui-card-content">
					<div class="mui-card-content-inner" v-for="(items,i) in Goog" :key="items.id">
						<mt-switch v-model="$store.getters.getGoodsSelected[items.id]"
                        @change="selectedChanged(items.id,$store.getters.getGoodsSelected[items.id])"
                        ></mt-switch>
                        <img :src="items.thumb_path">
                        <div class="info">
                            <h1>{{items.title}}</h1>
                            <p class="inofo">
                                <span class="price">￥{{items.sell_price}}</span>
                                <shopping :initcount="$store.getters.getOgood[items.id]" :geoid="items.id" ></shopping>
                                <!-- {{$store.getters.getOgood[iems.id]}} -->
                                <a @click.prevent="remove(items.id,i)">删除</a>
                            </p>
                        </div>
                        </div>
				</div>
                </div>
                <!-- 结算区域 -->
      <div class="mui-card">
				<div class="mui-card-content">
					<div class="mui-card-content-inner jieusan">
					<div >
                      <p >总计（不含运费）</p>
                      <!-- <p class="learf"> 已选择产品
                          <span>{{$store.getters.getAll.count}}</span>件,总价￥<span>{{$store.getters.getAll.amount}}</span></p> -->

                    <p class="shop">已选择产品<span>{{$store.getters.getAll.count}}</span>件，
                                 总价￥<span>{{$store.getters.getAll.amount}}</span></p>
          </div>
                       <mt-button type="danger">结算</mt-button>


                    
                    </div>
				</div>
                </div>
               
    </div>
</template>
<script>
import shopping  from "../cniues/shopping.vue";
export default {
    data() {
        return {
      Goog:[]
        }
    },
    created() {
        this.getGoog();
    },
    methods: {
        getGoog(){
            var idArr=[];
            this.$store.state.car.forEach(items => idArr.push(items.id));
            if (idArr.length <=0) {
                return;
            };
            this.$http.get("api/goods/getshopcarlist/"+idArr.join(",")).then(result=>{
               // console.log(retsun);
                if (result.body.status ==0) {
                    this.Goog =result.body.message;
                }
            })
        },
        remove(id,index){
            //删除
            this.Goog.splice(index,1);
            this.$store.commit("removeFromc",id)
        },
        seshai(id,val){
    this.$store.commit("selecteds",{id:id,selected:val})
    }

    },
    //组件
    components:{
        shopping
    }
    
}
</script>
<style lang="scss">
.carlist{
     .mui-card-content-inner{
         display: flex;
         img{
             width: 50px;
             height: 50px;
             margin: 0 10px;
         }
         h1{
             font-size: 16px;
         }
         .price{
             color:red;
             font-size: 16px;
             margin-right: 6px;
         }
         a{
             margin-left: 5px;
         }
         .inofo{
              display: flex;
              align-items: center;
             // justify-content: space-around;
         }
         .mui-numbox{
             height: 30px;
             width: 100px;
         }
     }
}
.jieusan{
    display: flex;
    justify-content: space-between;
    align-items: center;
    .shop span{
     color:red;
     font-size: 16px;
    }
}
</style>
